@charset "utf-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, caption, tbody, tfoot, thead, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, navbox, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0px; border: 0; font-size: 100%; outline: none; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; overflow-x: hidden;}
/* always display scrollbars */
body { font:14px/1.6 "PingFang SC Regular","Microsoft Yahei","微软雅黑","Arial","Helvetica","SimHei","黑体","STXihei","华文细黑",sans-serif; margin: 0 auto; color:#333; _background-attachment:fixed; 
_background-image:url(about:blank); width: 100%; height: 100%; overflow: hidden;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, navbox, section { display: block; }
input, select,button{vertical-align: middle;outline: none;padding:0;border:0;}
ol, ul,li{ list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
strong,i,em,b{ font-style:normal; font-weight:normal; }
img { border:0;}
input[type="text"], input[type="button"], input[type="submit"], input[type="reset"] { -webkit-appearance: none; border-radius: 0;}
textarea { -webkit-appearance: none; border-radius: 0; background:none; outline:none; padding:0; margin:0; border:none;}
::-moz-selection { background: #ff5722; color: #fff; text-shadow: none; }
::selection {background: #ff5722;color: #fff;text-shadow: none;}
a{ text-decoration:none; blr: expression(this.onFocus=this.blur()); cursor: pointer; color:#000; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; }
a:link, a:visited{ text-decoration: none;}
a:hover { text-decoration: none; color: #ff5722; }
.clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
.fl{ float:left;}
.fr{ float:right;}
h1,h2,h3,h4,h5{ font-weight:normal; display:block;}
input,button,table,tr,td,textarea{ font-family:Microsoft yahei,Arial;}
body{ min-width: 1240px; max-width: 1920px; width: 100%;}


@font-face {
	font-family: 'icomoon'; 
	src: url('../fonts/icomoon.ttf');

	src:
		url('../fonts/icomoon.eot') format('embedded-opentype');
		url('../fonts/icomoon.woff') format('woff');
		url('../fonts/icomoon.ttf') format('truetype');
		url('../fonts/icomoon.svg') format('svg');		
	font-weight: 300;
	font-style: normal;

}

.inner{ width: 1240px; margin: 0 auto;}

header{ position:relative; width:100%; z-index:990; transition: all .3s ease-in-out; display: flex; flex-direction: column; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);}
header .head{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; height: 89px; border-bottom: 1px solid #E5E5E5;}
header .head .inner{ display: flex; flex-direction: row; justify-content: space-between;}
header .head .inner .headLogo{ display: flex; flex-direction: column;}
header .head .inner .headArea{ display: flex; flex-direction: row; position: relative;}
header .head .inner .headArea .headAreaDiv{ display: flex; flex-direction: row; align-items: center;}
header .head .inner .headArea .headAreaDiv .areaIcon{ margin-right: 6px;}
header .head .inner .headArea .headAreaDiv span{ color: #ff5722; cursor: pointer;}
header .head .inner .headArea .headAreaBox{ display:none; width:100%; position:absolute; left:0; top:40px; z-index:1000; padding:10px 0; background:#fff; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); text-align: center;}
header .head .inner .headArea .headAreaBox:before{ content: ''; position: absolute; top: -10px; left: 50%; margin-left: -7px; width: 0; height: 0; border-right: 14px solid transparent; border-left: 14px solid transparent; border-bottom: 10px solid #FFF;}
header .head .inner .headArea .headAreaBox a{ display: block; line-height: 2.2;}
header .head .inner .headArea .headAreaBox a:hover{ color:#ff5722}
header .head .inner .headSearch{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; border: 2px solid #E5E5E5; background: #F8F8F8; position: relative; height: 40px; line-height: 40px;}
header .head .inner .headSearch .select{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 130px; padding: 0 10px; background: #F8F8F8;}
header .head .inner .headSearch .text{ width: 400px; padding: 0 10px; height: 40px; border-left: 2px solid #E5E5E5; background: #FFF;}
header .head .inner .headSearch .sub{ position: absolute; right: -2px; top: -2px; bottom: -2px; background: #ff5722; z-index: 10; color: #FFF; font-size: 15px; padding: 0 20px; cursor: pointer;}
header .head .inner .headTel{ display: flex; flex-direction: row; align-items: flex-end;}
header .head .inner .headTel div{ display: flex; flex-direction: column; text-align: right; line-height: 1.2; padding-left: 10px;}
header .head .inner .headTel div span{ font-size: 15px; color: #555;}
header .head .inner .headTel div sup{ font-family: 'DIN'; font-size: 26px; font-weight: bold;}

header .menubox{ display: flex; flex-direction: column; background: #FFF; position: relative; z-index: 999; transition: all .5s ease-in-out;}
header .menubox .inner{ display: flex; flex-direction: row; justify-content: space-between; height: 60px;}
header .menubox .inner ol{ display: flex; flex-direction: row; align-items: center;}
header .menubox .inner ol li{ margin-right: 80px; height: 60px; display: flex; flex-direction: column; justify-content: center; position: relative;}
header .menubox .inner ol li:before{ content: ''; width: 26px; height: 2px; background: #ff5722; position: absolute; left: 50%; margin-left: -13px; bottom: -4px; display: none;}
header .menubox .inner ol li a.menuboxLi{ font-size: 18px; display: inline-block;}
header .menubox .inner ol li a.menuboxLi span{ position: absolute; top: 5px; right: -37px; display: block; width: 34px; height: 18px; line-height: 20px; color: #fff; background: #ff5722; border-radius: 10px; border-bottom-left-radius: 0; font-family: arial; text-align: center; text-transform: uppercase; font-size: 12px;}
header .menubox .inner ol li.on:before{ display: block;}
header .menubox .inner ol li.on a.menuboxLi{ color: #ff5722;}
header .menubox .inner .menuboxLink{ display: flex; flex-direction: column; justify-content: center;}
header .menubox .inner .menuboxLink a{ display: flex; flex-direction: column; background: #ff5722; color: #FFF; font-size: 16px; width: 130px; height: 40px; border-radius: 20px; justify-content: center; align-items: center; transition: all 300ms;}
header .menubox .inner .menuboxLink a:hover{ opacity: 0.7;}
header.scroll .menubox{ position: fixed; top: 0; left: 0; right: 0; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);}


.menuboxDiv{ position: absolute; top: 60px; background: #FFF; z-index: 10; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); width: 170%; display: none; flex-direction: column; text-align: center; left:-24px;}
.menuboxDiv a{ display: block; line-height: 50px; border-bottom: 1px dotted #E5E5E5; color: #333;}
.menuboxDiv a:hover{ background: #ff5722; color: #FFF;}
header .menubox .inner ol li.xiala:hover .menuboxDiv{ display: block;}



.banner{ display: flex; flex-direction: column;}
.banner .swiper-container{ width: 100%; height: 100%;}
.banner .swiper-container .swiper-slide{ display: flex; flex-direction: column; height: 600px; background-position: center center;}
.banner .swiper-container .swiper-button-next:after,.banner .swiper-container  .swiper-button-prev:after{ color: #FFF; opacity: 0.6;}
.banner .swiper-container .swiper-pagination-bullet-active{ background: #FFF;}


footer{ display: flex; flex-direction: column; padding-bottom: 30px; background: url(../images/footer.jpg) no-repeat; background-size: cover;}
footer .foot{ display: flex; flex-direction: row; justify-content: space-between; padding: 60px 0;}
footer .foot .footOl{ display: flex; flex-direction: row;}
footer .foot .footOl li{ display: flex; flex-direction: column; padding-right: 100px; line-height: 2.6;}
footer .foot .footOl li h2{ font-size: 16px; color: #FFF;}
footer .foot .footOl li figure{ display: flex; flex-direction: column;}
footer .foot .footOl li figure a{ color: #FFF; opacity: 0.5; transition: all 0.3s;}
footer .foot .footOl li figure a:hover{ opacity: 1;}
footer .foot .footCont{ display: flex; flex-direction: column; width: 260px;}
footer .foot .footCont .footContDiv{ display: flex; flex-direction: row; align-items: center; justify-content: space-between; margin-bottom: 15px; color: #FFF;}
footer .foot .footCont .footContDiv img{ width: 22px; height: 22px;}
footer .foot .footCont .footContDiv sup,footer .foot .footCont .footContDiv  span{ width: 220px;}
footer .foot .footCont .footContDiv sup{ font-family: 'DIN'; font-weight: bold; font-size: 30px;}
footer .foot .footWechat{ display: flex; flex-direction: column; color: #FFF; text-align: center;}
footer .foot .footWechat span{ padding: 10px 0;}
footer .link{display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex; display: flex; color: #FFF; line-height: 2; border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 30px;}
footer .link .linkTit{ display: flex; flex-direction: column; width: 80px;}
footer .link .linkDiv{ -webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; overflow:hidden;}
footer .link .linkDiv a{ color: #FFF; opacity: 0.5; transition: all 0.3s; margin-right: 30px;}
footer .link .linkDiv a:hover{ opacity: 1;}
footer .weibu{ display: flex; flex-direction: row; justify-content: space-between; color: #FFF; opacity: 0.5; padding: 30px 0;}
footer .weibu a{ color: #FFF;}
footer .weibu figure span{ padding: 0 10px;}

.rippleTop{ position: fixed; bottom:40px; right: 30px; background: #ff5722; border-radius: 3px; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); transition: all 300ms; z-index: 1000; cursor: pointer; display: flex; flex-direction: column; width: 40px; padding: 10px; align-items: center; justify-content: center;}
.rippleTop img{ width: 22px;}
.rippleTop span{ padding-top: 6px; color: #FFF;}
.rippleTop:hover{ background: #ff636f;}




.offer{ width: 100%; display: flex; flex-direction: column; position: fixed; left: 0; bottom: 0; right: 0; z-index: 110; }
.offer .offerAddup{ display: flex; flex-direction: row; justify-content: center; align-items: center; height: 44px; position: relative; margin: 0 auto; width: 480px; cursor: pointer; background: rgba(0,0,0,0.9); border-top-left-radius: 44px; border-top-right-radius: 44px;}
.offer .offerAddup .offerAddupImg{ display: flex; flex-direction: column;}
.offer .offerAddup .offerAddupFont{ display: flex; flex-direction: row; align-items: center; color: #FFF; font-size: 20px; padding: 0 10px; font-weight: bold;}
.offer .offerAddup .offerAddupFont span{ color: #C69C4E;}
.offer .offerAddup .offerAddupFont sup{}
.offer .offerAddup .offerAddupArrow{ display: flex; flex-direction: column; align-items: center; justify-content: center;}
.offer .offerAddup .offerAddupArrow img{ animation: b 1.5s linear infinite; transition: all 1s;}
@keyframes b{
	0% {
		/* opacity: 0; */
		transform: translateY(-10px);
	}
	25% {
		transform: translateY(0px);
	}
	75% {
		transform: translateY(10px);
	}
	100% {
		/* opacity: 0; */
		transform: translateY(-10px);
	}
}
.offer .offerShow{ display:block; width:100%; z-index:100; background: rgba(0,0,0,0.6);}
.offer .offerShow .inner{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; height: 160px; padding-right: 50px;}
.offer .offerShow .inner .offerShowLeft{ display: flex; flex-direction: row; align-items: center;}
.offerShowLeft img.ren{ height: 300px;}
/*.offer .offerShow .inner .offerShowLeft p{color: #C69C4E;transform: rotate(20deg); font-size: 30px; padding-left: 20px;}*/
.offer .offerShow .inner .offerShowLeft p{color: #ffffff;font-size: 30px; padding-left: 20px;}
.offer .offerShow .inner .offerShowLeft p span{ color: #C69C4E;}
.footer1close{ position: absolute; top: 0; right: 0; cursor: pointer;}
.offer .offerShow .inner .offerShowTian{ display: flex; flex-wrap: wrap; width: 560px;}
.offer .offerShow .inner .offerShowTian .offerShowTianDiv{ width: 250px; padding: 0 10px; background: #FFF; border-radius: 4px; margin: 5px;}
.offer .offerShow .inner .offerShowTian .offerShowTianDiv .text{ width: 100%; height: 50px;}
.offer .offerShow .inner .offerShowRight{display: flex;display: -ms-flexbox;display: -webkit-flex;align-items: center;color: #FFF;}
.offer .offerShow .inner .offerShowRight .offerShowRightrRound{position: relative;z-index: 1;cursor: pointer;width: 120px;height: 120px;border-radius: 50%;position: relative;background: rgb(255 255 255 / 0%);}
.offer .offerShow .inner .offerShowRight .offerShowRightrRound .offerShowRightRoundOne{width: 120px;height: 120px;border-radius: 50%;background: rgba(255,255,255,0.2);-webkit-animation:warn 2s linear 0s infinite;-moz-animation:warn 2s linear 0s infinite;animation:warn 2s linear 0s infinite;}
.offer .offerShow .inner .offerShowRight .offerShowRightrRound .offerShowRightRoundTwo{width: 90px;height: 90px;border-radius: 50%;background: #ff5722;color: #fff;font-size: 16px;display: flex;flex-direction: column;align-items: center;justify-content: center;position: absolute;left: 15px;top:15px;right: 15px;bottom: 15px;z-index: 10;}						
.offer .offerShow .inner .offerShowRight .offerShowRightrRound .offerShowRightRoundTwo span{ padding-top: 4px;}
@keyframes warn {
    0% {
        transform:scale(0.5);
        opacity:0;
    }
    25% {
        transform:scale(0.8);
        opacity:0.5;
    }
    50% {
        transform:scale(1);
        opacity:1;
    }
    75% {
        transform:scale(1.1);
        opacity:0.5;
    }
    100% {
        transform:scale(1.2);
        opacity:0;
    }
}
@-webkit-keyframes warn {
    0% {
        transform:scale(0.5);
        opacity:0;
    }
    25% {
        transform:scale(0.8);
        opacity:0.5;
    }
    50% {
        transform:scale(1);
        opacity:1;
    }
    75% {
        transform:scale(1.1);
        opacity:0.5;
    }
    100% {
        transform:scale(1.2);
        opacity:0;
    }
}
	

/* 首页样式 */
.clause{ display: flex; flex-direction: column; padding: 25px 0; background: #F8F8F8;}
.clause .inner{ display: flex; flex-direction: row; justify-content: space-between;}
.clause .inner .clauseDiv{overflow:hidden;display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex; display: flex; background: #FFF; border: 1px solid #E5E5E5; transition: all 0.3s; padding: 20px; height: 100px; width: 250px; cursor: pointer;}
.clause .inner .clauseDiv .clauseDivLeft{-webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; overflow:hidden; padding-right: 10px;}
.clause .inner .clauseDiv .clauseDivLeft h2{ font-size: 20px;}
.clause .inner .clauseDiv .clauseDivLeft h2 span{ font-family: 'DIN'; font-size: 26px; font-weight: bold; color: #ff5722;}
.clause .inner .clauseDiv .clauseDivLeft p{ color: #555; margin-top: 10px;}
.clause .inner .clauseDiv .clauseDivPic{ display: flex; flex-direction: column; align-items: center; justify-content: center;}
.clause .inner .clauseDiv:nth-child(3) .clauseDivLeft h2{ font-size: 18px;}
.clause .inner .clauseDiv:hover{ box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); margin-top: -5px;}
.clause .inner .clauseDiv:hover .clauseDivPic img{ animation: jello 1.2s;}
@keyframes jello {

	from,
	11.1%,
	to {
		-webkit-transform: none;
		-moz-transform: none;
		transform: none
	}

	22.2% {
		-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
		-moz-transform: skewX(-12.5deg) skewY(-12.5deg);
		transform: skewX(-12.5deg) skewY(-12.5deg)
	}

	33.3% {
		-webkit-transform: skewX(6.25deg) skewY(6.25deg);
		-moz-transform: skewX(6.25deg) skewY(6.25deg);
		transform: skewX(6.25deg) skewY(6.25deg)
	}

	44.4% {
		-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
		-moz-transform: skewX(-3.125deg) skewY(-3.125deg);
		transform: skewX(-3.125deg) skewY(-3.125deg)
	}

	55.5% {
		-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
		-moz-transform: skewX(1.5625deg) skewY(1.5625deg);
		transform: skewX(1.5625deg) skewY(1.5625deg)
	}

	66.6% {
		-webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
		-moz-transform: skewX(-.78125deg) skewY(-.78125deg);
		transform: skewX(-.78125deg) skewY(-.78125deg)
	}

	77.7% {
		-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
		-moz-transform: skewX(0.390625deg) skewY(0.390625deg);
		transform: skewX(0.390625deg) skewY(0.390625deg)
	}

	88.8% {
		-webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
		-moz-transform: skewX(-.1953125deg) skewY(-.1953125deg);
		transform: skewX(-.1953125deg) skewY(-.1953125deg)
	}

}

.index{ display: flex; flex-direction: column; padding: 30px 0;}
.index .indexTitle{ display: flex; flex-direction: column; justify-content: center; align-items: center; padding-bottom: 30px;}
.index .indexTitle h2{ font-size: 40px;}
.index .indexTitle p{ font-size: 18px; color: #888;}
.index .indexTitle span{ width: 50px; height: 3px; background: url(../images/indextitle.png) no-repeat; margin: 15px 0;}

.exclu{ display: flex; flex-direction: row; justify-content: space-between;}
.exclu .excluLeft{ width: 300px; display: flex; flex-direction: column;}
.exclu .excluLeft .excluLeftDiv{ display: flex; flex-direction: column; border: 1px solid #E5E5E5; transition: all 0.3s;}
.exclu .excluLeft .excluLeftDiv:nth-child(2){ margin-top: 12px;}
.exclu .excluLeft .excluLeftDiv .excluIcon{ display: flex; flex-direction: column; padding: 35px 20px; height: 110px;}
.exclu .excluLeft .excluLeftDiv .excluIcon.excluIcon11{ background-image: url(../images/excluicon11.jpg); background-repeat: no-repeat; background-position: right bottom;}
.exclu .excluLeft .excluLeftDiv .excluIcon.excluIcon22{ background-image: url(../images/excluicon22.jpg); background-repeat: no-repeat; background-position: right bottom;}
.exclu .excluLeft .excluLeftDiv .excluIcon.excluIcon33{ background-image: url(../images/excluicon33.jpg); background-repeat: no-repeat; background-position: right bottom;}
.exclu .excluLeft .excluLeftDiv .excluIcon.excluIcon44{ background-image: url(../images/excluicon44.jpg); background-repeat: no-repeat; background-position: right bottom;}
.exclu .excluLeft .excluLeftDiv .excluIcon.excluIcon55{ background-image: url(../images/excluicon55.jpg); background-repeat: no-repeat; background-position: right bottom;}
.exclu .excluLeft .excluLeftDiv .excluIcon h2{ font-size: 24px;}
.exclu .excluLeft .excluLeftDiv .excluIcon p{ color: #888;}
.exclu .excluLeft .excluLeftDiv .excluIcon.height{ height: 302px;}
.exclu .excluLeft .excluLeftDiv:hover{ box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);}
.exclu .excluBox{ width: 270px; display: flex; flex-direction: column; border: 1px solid #E5E5E5; padding: 15px;}
.exclu .excluBox .excluBoxTit{ display: flex; flex-direction: column; text-align: center;}
.exclu .excluBox .excluBoxTit h2{ font-size: 26px;}
.exclu .excluBox .excluBoxTit p{ color: #555; font-size: 15px;}
.exclu .excluBox .excluBoxTit p span{ padding: 0 4px;}
.exclu .excluBox .excluBoxTian{ display: flex; flex-direction: column;}
.exclu .excluBox .excluBoxTian .excluBoxTianLi{ display: flex; flex-direction: column; margin-top: 10px; padding: 0 10px; background: #F8F8F8; border: 1px solid #E5E5E5; border-radius: 4px;}
.exclu .excluBox .excluBoxTian .excluBoxTianLi .text{ width: 100%; height: 50px; background: none;}
.exclu .excluBox .excluBoxDown{ display: flex; flex-direction: row; justify-content: space-between; margin-top: 10px;}
.exclu .excluBox .excluBoxDown .excluBoxDownLi{ width: 48%; display: flex; flex-direction: column;}
.exclu .excluBox .excluBoxDown .excluBoxDownLi .sub{ width: 100%; border-radius: 4px; height: 50px; font-size: 15px; color: #FFF; cursor: pointer; transition: all 0.3s;}
.exclu .excluBox .excluBoxDown .excluBoxDownLi:nth-child(1) .sub{ background: #919191;}
.exclu .excluBox .excluBoxDown .excluBoxDownLi:nth-child(2) .sub{ background: #ff5722;}
.exclu .excluBox .excluBoxDown .excluBoxDownLi:nth-child(1):hover .sub{ background: #ff5722;}
.exclu .excluBox .excluBoxDown .excluBoxDownLi:nth-child(2):hover .sub{ background: #C69C4E;}
.exclu .excluBox .excluBoxExe{ display: flex; flex-direction: row; color: #888; padding-top: 10px;}
.exclu .excluBox .excluBoxExe span{ color: #000;}

.analy{ padding-top: 0;}
.analyBox{ display: flex; flex-direction: column; position:relative; overflow: hidden;}
.analyBox .analyBoxDiv{ border: 1px solid #E5E5E5; background: #FFF; height: 60px; display: flex; flex-direction: row; justify-content: center;}
.analyBox .analyBoxDiv li{ display: flex; flex-direction: row; align-items: center; justify-content: center; cursor: pointer; font-size: 16px;}
.analyBox .analyBoxDiv li span{ font-size: 14px; color: #AAA; padding: 0 40px;}
.analyBox .analyBoxDiv li:last-child span{ display: none;}
.analyBox .analyBoxDiv li.on sup{ color: #ff5722; text-decoration: underline;}
.analyBox .analyBoxDown{ overflow:hidden;}
.analyBox .analyBoxDown .small{display: none;min-width: 1240px;margin-top: 30px;}
.analyBox .analyBoxDown .small.on{display: flex;width: 1240px;margin: 30px auto auto auto;}
.small ol{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.small ol li{width: 33%;display: flex;flex-direction: column;box-sizing: border-box;}
.small ol li .smallBox{display: flex;flex-direction: column;margin: 5px;position: relative;height: 309.72px;}
.small ol li .smallBox .smallBoxPic,.small ol li .smallBoxPic a{ display: flex; flex-direction: column; overflow: hidden;}
.small ol li .smallBox .smallBoxPic a img{ width: 100%; transition:all 0.3s linear;}
.small ol li .smallBox .smallBoxDiv{ display: flex; flex-direction: column; justify-content: center; padding: 0 10px; position: absolute; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4); height: 50px; z-index: 10; transition:all 0.3s linear;}
.small ol li .smallBox .smallBoxDiv .smallBoxDivPrice{background: url(../images/smalldivprice.png) no-repeat;width: 165px;height: 50px;display: flex;flex-direction: row;align-items: flex-end;padding: 10px 0 10px 10px;position: absolute;left: 0;bottom: 0;z-index: 2;}
.small ol li .smallBox .smallBoxDiv .smallBoxDivPrice span{ color: #FFF; font-size: 16px;}
.small ol li .smallBox .smallBoxDiv .smallBoxDivPrice sup{ color: #FFF; font-size: 50px; font-weight: bold; padding: 0 6px; line-height: 1; font-family: 'DIN';}
.small ol li .smallBox .smallBoxDiv .smallBoxDivTent{ color: #FFF; display: flex; flex-direction: row; justify-content: flex-end;padding-left: 120px; font-size: 16px;}
.small ol li .smallBox .smallBoxDiv .smallBoxDivTent b{ padding: 0 6px;}
.small ol li .smallBox .smallBoxWord{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 20; background: rgba(0,0,0,0.5); display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 10px; opacity: 0; transition:all 0.3s linear;}
.small ol li .smallBox .smallBoxWord .smallBoxWordTit{font-size: 20px;color: #FFF;font-weight: bold;}
.small ol li .smallBox .smallBoxWord figure{ display: flex; flex-direction: row; padding: 15px 0 30px; color: #FFF; font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.small ol li .smallBox .smallBoxWord figure b{ padding: 0 6px;}
.small ol li .smallBox .smallBoxWord figcaption{ display: flex; flex-direction: row;}
.small ol li .smallBox .smallBoxWord figcaption a{ display: flex; flex-direction: column; justify-content: center; padding: 0 20px; margin: 0 10px; border-radius: 4px; height: 44px; font-size: 16px;}
.small ol li .smallBox .smallBoxWord figcaption a.smallBoxWordMore{ color: #ff5722; background: #FFF;}
.small ol li .smallBox .smallBoxWord figcaption a.smallBoxWordQian{ color: #FFF; background: #ff5722;}
.small ol li .smallBox:hover .smallBoxPic a img{ transform:scale(1.06);}
.small ol li .smallBox:hover .smallBoxDiv{ opacity: 0;}
.small ol li .smallBox:hover .smallBoxWord{ opacity: 1;}
.small ol li .smallBox .smallBoxWord figcaption a.smallBoxWordMore:hover{ background: #ff5722; color: #FFF;}
.small ol li .smallBox .smallBoxWord figcaption a.smallBoxWordQian:hover{ background: #C69C4E;}
.viewMore{ display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: 30px;}
.viewMore a{ margin: 0 15px;}
.viewMore .viewMoreAn{ background: #919191; line-height: 44px; padding: 0 50px; border-radius: 22px; color: #FFF; font-size: 16px; transition: all 0.3s linear;}
.viewMore .viewMoreAn:hover{ background: #ff5722;}


@media screen and (max-width:1600px){
	.small ol li .smallBox .smallBoxDiv{ height: 40px;}
	.small ol li .smallBox .smallBoxDiv .smallBoxDivPrice{ width: 100px; height: 38px; padding: 5px 0 5px 5px; background-size: 100%;}
	.small ol li .smallBox .smallBoxDiv .smallBoxDivPrice span,.small ol li .smallBox .smallBoxWord figure{ font-size: 14px; line-height: 1.3;}
	.small ol li .smallBox .smallBoxDiv .smallBoxDivPrice sup{ font-size: 38px;}
	.small ol li .smallBox .smallBoxDiv .smallBoxDivTent{ font-size: 14px; padding-left: 80px;}
	.small ol li .smallBox .smallBoxWord .smallBoxWordTit{ font-size: 22px;}
	.small ol li .smallBox .smallBoxWord figcaption a{ height: 38px; padding: 0 10px; font-size: 14px;}
	.small ol li .smallBox .smallBoxWord figure b,.small ol li .smallBox .smallBoxDiv .smallBoxDivTent b{ display: none;}
	.small ol li .smallBox .smallBoxDiv .smallBoxDivTent span,.small ol li .smallBox .smallBoxDiv .smallBoxDivPrice span, .small ol li .smallBox .smallBoxWord figure span{ padding: 0 2px;}
	
	}

/* 我家这样装多少钱？ */
.cash{position:fixed;top:0 !important;left:0;display:none;z-index:1000; width:100%; height:100%; background: rgba(0,0,0,0.3);}
.cash .cashBox{ position: absolute; width: 800px; left: 50%; top: 50%; height: 520px; transform: translate(-50%,-50%); box-sizing: border-box; background: url(../images/cashbox.jpg) no-repeat; box-shadow: 0 0 20px 0 rgba(0,0,0,0.2);}
.cash .cashBox .close{ display: flex; flex-direction: column; justify-content: center; align-items: center; position:absolute; right: 15px; top: 15px; font-size: 20px; color: #FFF; background: rgba(0,0,0,0.5); width: 30px; height: 30px; border-radius: 50%; }
.cash .cashBox .close:hover{ background: rgba(230,0,18,0.5);}
.cash .cashBox .cashBoxDiv{display: flex; flex-direction: column; border-top: 6px solid #ff5722; padding: 0 90px;}
.cash .cashBox .cashBoxDiv .cashBoxDivMing{ display: flex; flex-direction: column; align-items: center; padding: 30px 0;}
.cash .cashBox .cashBoxDiv .cashBoxDivMing h2{ font-size: 32px;}
.cash .cashBox .cashBoxDiv .cashBoxDivMing p{ color: #ff5722; padding: 10px 0;}
.cash .cashBox .cashBoxDiv .cashBoxDivMing h3{ font-size: 22px; font-weight: bold; padding-top: 30px;}
.cash .cashBox .cashBoxDiv .cashBoxDivQian{ display: flex; flex-direction: column;}
.cash .cashBox .cashBoxDiv .cashBoxDivQian ul{ display: flex; flex-direction: row; flex-wrap: wrap;}
.cash .cashBox .cashBoxDiv .cashBoxDivQian ul li{ display: flex; flex-direction: row; justify-content: center; width: 50%; font-size: 20px; line-height: 40px;}
.cash .cashBox .cashBoxDiv .cashBoxDivQian ul li span{ color: #ff5722; font-family: 'DIN'; font-size: 30px; font-weight: bold; width: 120px; text-align: center;}
.cash .cashBox .cashBoxDiv .cashBoxDivTian{ display: flex; flex-direction: row; justify-content: space-between; padding: 40px 0 20px;}
.cash .cashBox .cashBoxDiv .cashBoxDivTian .cashBoxDivTianLi{ width: 48%; padding: 0 20px; box-sizing: border-box; display: flex; flex-direction: column; background: #FFF; border: 1px solid #AAA;}
.cash .cashBox .cashBoxDiv .cashBoxDivTian .cashBoxDivTianLi .text{ width: 100%; height: 50px; font-size: 16px;}
.cash .cashBox .cashBoxDiv .cashBoxDivNiu{ display: flex; flex-direction: column;}
.cash .cashBox .cashBoxDiv .cashBoxDivNiu .sub{ width: 100%; height: 50px; background: #ff5722; color: #FFF; font-weight: bold; font-size: 18px; cursor: pointer; transition: all 0.3s linear;}
.cash .cashBox .cashBoxDiv .cashBoxDivNiu .sub:hover{ background: #C69C4E;}


.whole{ background: #F8F8F8;}
.wholeBox{ display: flex; flex-direction: column; position:relative; overflow: hidden;}
.wholeBox .wholeBoxDiv{ border: 1px solid #E5E5E5; background: #FFF; height: 60px; display: flex; flex-direction: row; justify-content: center;}
.wholeBox .wholeBoxDiv li{ display: flex; flex-direction: row; align-items: center; justify-content: center; cursor: pointer; font-size: 16px;}
.wholeBox .wholeBoxDiv li sup{ padding: 0 30px;}
.wholeBox .wholeBoxDiv li.on sup{ color: #ff5722; text-decoration: underline;}
.wholeBox .wholeBoxDown{ overflow:hidden;}
.wholeBox .wholeBoxDown .entire{ display: none; margin-top: 10px;}
.wholeBox .wholeBoxDown .entire.on{ display: flex;}
.entire{ display: flex; flex-direction: column; position: relative;}
.entire ol{ display: flex; flex-wrap: wrap;}
.entire ol li{ display: flex; flex-direction: column; overflow: hidden; margin-top: 20px; margin-left: 20px; position: relative;}
.entire ol li.entireOne{ width: 240px;}
.entire ol li.entireOne:nth-child(1),.entire ol li.entireOne:nth-child(4){ margin-left: 0; margin-right: 480px;}
.entire ol li.entireOne .entireOnePic,.entire ol li.entireOne .entireOnePic a{ display: flex; flex-direction: column; overflow: hidden; height: 300px;}
.entire ol li.entireOne .entireOnePic a img{ width: 100%; transition: all 0.3s linear;}
.entire ol li.entireOne .entireOneDiv{ display: flex; flex-direction: column; align-items: center; position: absolute; left: 0; right: 0; bottom: -40px; z-index: 10; padding: 0 10px 10px; background: rgba(0,0,0,0.5); transition: all 0.3s linear;}
.entire ol li.entireOne .entireOneDiv h2{ display: flex; flex-direction: row; align-items: center; color: #FFF; line-height: 40px; font-size: 18px;}
.entire ol li.entireOne .entireOneDiv h2 span{ font-size: 15px; opacity: 0.7; padding-left: 6px;}
.entire ol li.entireOne .entireOneDiv figure{ display: flex; flex-direction: row; justify-content: space-between;}
.entire ol li.entireOne .entireOneDiv figure a{ line-height: 30px; padding: 0 20px; border-radius: 15px; margin: 0 5px;}
.entire ol li.entireOne .entireOneDiv figure a:nth-child(1){ background: #FFF; color: #ff5722;}
.entire ol li.entireOne .entireOneDiv figure a:nth-child(2){ background: #ff5722; color: #FFF;}
.entire ol li.entireOne:hover .entireOnePic a img{ transform:scale(1.06);}
.entire ol li.entireOne:hover .entireOneDiv{ bottom: 0;}
.entire ol li.entireOne .entireOneDiv figure a:nth-child(1):hover{ background: #ff5722; color: #FFF;}
.entire ol li.entireOne .entireOneDiv figure a:nth-child(2):hover{ background: #C69C4E;}

.entire ol li.entireTwo{ display: flex; flex-direction: column; position: absolute; left: 240px; top: 0; width: 460px; height: 620px;}
.entire ol li.entireTwo:before{ content: ''; position: absolute; left: 10px; top: 10px; right: 0; bottom: 0; background: #ff5722; opacity: 0.1; z-index: 0;}
.entire ol li.entireTwo .entireTwoPic,.entire ol li.entireTwo .entireTwoPic a{ display: flex; flex-direction: column; overflow: hidden; width: 450px; height: 610px; position: relative; z-index: 2;}
.entire ol li.entireTwo .entireTwoPic a img{width: 75%;transition: all 0.3s linear;height: 100%;object-fit: cover;margin-left: 50px;}
.entire ol li.entireTwo .entireTwoDiv{ display: flex; flex-direction: column; position: absolute; left: 0; right: 10px; bottom: 10px; z-index: 10; padding: 20px; background: rgba(0,0,0,0.5);}
.entire ol li.entireTwo .entireTwoDiv h2{ display: flex; flex-direction: row; align-items: center; color: #FFF; line-height: 30px; font-size: 18px;}
.entire ol li.entireTwo .entireTwoDiv h2 span{ font-size: 15px; opacity: 0.7; padding-left: 6px;}
.entire ol li.entireTwo .entireTwoDiv figure{ color: #FFF; opacity: 0.7; line-height: 2;}
.entire ol li.entireTwo .entireTwoDiv figure p{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.entire ol li.entireTwo .entireTwoDiv figcaption{ position: absolute; right: 20px; top: 20px; z-index: 2;}
.entire ol li.entireTwo .entireTwoDiv figcaption a{ display: flex; flex-direction: row; justify-content: center; align-items: center; color: #FFF; font-size: 16px; line-height: 44px; background: #ff5722; padding: 0 20px; border-radius: 22px;}
.entire ol li.entireTwo .entireTwoDiv figcaption a img{ margin-right: 4px;}
.entire ol li.entireTwo:hover .entireTwoPic a img{ transform:scale(1.1);}
.entire ol li.entireTwo:hover .entireTwoDiv figcaption a{ background: #C69C4E;}


/* 预约设计师 */
.custom{position:fixed;top:0 !important;left:0;display:none;z-index:1000; width:100%; height:100%; background: rgba(0,0,0,0.3);}
.custom .customBox{ position: absolute; width: 520px; left: 50%; top: 50%; height: 520px; transform: translate(-50%,-50%); box-sizing: border-box; background: #FFF; box-shadow: 0 0 20px 0 rgba(0,0,0,0.2);}
.custom .customBox .close{ display: flex; flex-direction: column; justify-content: center; align-items: center; position:absolute; right: 15px; top: 15px; font-size: 20px; color: #FFF; background: rgba(0,0,0,0.5); width: 30px; height: 30px; border-radius: 50%; }
.custom .customBox .close:hover{ background: rgba(230,0,18,0.5);}
.custom .customBox .customBoxDiv{display: flex; flex-direction: column; padding: 20px 55px;}
.custom .customBox .customBoxDiv .customBoxDivTit{ display: flex; flex-direction: column; align-items: center; line-height: 2;}
.custom .customBox .customBoxDiv .customBoxDivTit h2{ font-size: 30px;}
.custom .customBox .customBoxDiv .customBoxDivTit p{ color: #666;}
.custom .customBox .customBoxDiv .customBoxDivTian{ display: flex; flex-direction: column; padding: 10px 0;}
.custom .customBox .customBoxDiv .customBoxDivTian .customBoxDivTianLi{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex; display: flex; align-items: center; margin-top: 15px;}
.custom .customBox .customBoxDiv .customBoxDivTian .customBoxDivTianLi .customBoxDivTianLiCont{ width: 90px; font-size: 16px;}
.custom .customBox .customBoxDiv .customBoxDivTian .customBoxDivTianLi .customBoxDivTianLiTent{-webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; display: flex; flex-direction: column; border: 1px solid #E5E5E5; padding: 0 10px;}
.custom .customBox .customBoxDiv .customBoxDivTian .customBoxDivTianLi .customBoxDivTianLiTent .text{ width: 100%; height: 50px; color: #888;}
.custom .customBox .customBoxDiv .customBoxDivTian .customBoxDivTianOn{ display: flex; flex-direction: column; margin-top: 15px;}
.custom .customBox .customBoxDiv .customBoxDivTian .customBoxDivTianOn .sub{ height: 50px; background: #ff5722; font-size: 18px; color: #FFF; cursor: pointer; transition: all 0.3s linear;}
.custom .customBox .customBoxDiv .customBoxDivTian .customBoxDivTianOn .sub:hover{ background: #C69C4E;}
.custom .customBox .customBoxDiv .customBoxDivExe{ display: flex; flex-direction: column; text-align: center; color: #AAA; padding-top: 10px;}

.being{ display: flex; flex-direction: column; position: relative;}
.being .swiper-container{ width: 100%; height: 100%;}
.being .swiper-container .beingPic,.being .swiper-container .beingPic a{ display: flex; flex-direction: column; position: relative; overflow: hidden;}
.being .swiper-container .beingPic img{ width: 100%; transition: all 0.3s linear;}
.being .swiper-container .beingPic h2{ position: absolute; left: 0; bottom: 0; right: 0; padding: 0 10px; line-height: 50px; font-size: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: rgba(0,0,0,0.5); color: #FFF; text-align: center; transition: all 0.3s linear;}
.being .swiper-container .beingTent{ display: flex; flex-direction: row; font-size: 15px; color: #555; align-items: center; justify-content: center; background: #F8F8F8; padding: 0 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 50px;}
.being .swiper-container .beingTent sup{ padding: 0 10px;}
.being .swiper-container .beingPic:hover img{ transform: scale(1.1);}
.being .swiper-container .beingPic:hover h2{ background: rgba(230,0,18,0.5);}
.being .swiper-button-next, .being .swiper-button-prev{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 60px; height: 60px; background: #F8F8F8; border-radius: 50%; box-shadow: 0 0 5px 0 rgba(0,0,0,0.2);}
.being .swiper-button-next:after, .being .swiper-button-prev:after{ font-size: 24px; color: #AAAAAA;}
.being .swiper-button-next{ right: -85px;}
.being .swiper-button-prev{ left: -85px;}
.being .swiper-button-next:hover, .being .swiper-button-prev:hover{ background: #ff5722;}
.being .swiper-button-next:hover:after, .being .swiper-button-prev:hover:after{ color: #FFF;}

.screed{ display: flex; flex-direction: column; background: url(../images/screed.png) no-repeat; height: 135px; justify-content: flex-end; margin-top: 40px;}
.screed .screedBox{ display: flex; flex-direction: row; justify-content: space-between; height: 120px; padding: 0 20px 0 210px; align-items: center;}
.screed .screedBox .screedBoxTit{ color: #FFF; font-size: 22px; font-weight: bold;}
.screed .screedBox .screedBoxKuang{ display: flex; flex-direction: row; justify-content: space-between;}
.screed .screedBox .screedBoxKuang .text{ width: 150px; height: 44px; line-height: 100%; padding: 0 15px; background: #FFF; border-radius: 22px; margin-right: 10px;}
.screed .screedBox .screedBoxKuang .sub{ width: 80px; height: 44px; background: #C69C4E; border-radius: 22px; color: #FFF; cursor: pointer;}
.screed .screedBox .screedBoxKuang .sub:hover{ opacity: 0.9;}


.heine{ display: flex; flex-direction: column; position: relative; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);}
.heine .swiper-container{ width: 100%; height: 100%;}
.heine .swiper-container .swiper-slide{ display: flex; flex-direction: row; justify-content: space-between;}
.heine .swiper-container .heinePic,.heine .swiper-container .heinePic a{ display: flex; flex-direction: column; width: 700px;}
.heine .swiper-container .heinePic img{ width: 100%;}
.heine .swiper-container .heineWord{ display: flex; width: 460px; padding: 30px 40px; flex-direction: column; position: relative;}
.heine .swiper-container .heineWord .heineWordTit{ display: flex; flex-direction: column; line-height: 2;}
.heine .swiper-container .heineWord .heineWordTit h2 a{ font-size: 28px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.heine .swiper-container .heineWord .heineWordTit figure{ display: flex; flex-direction: row; font-size: 16px;}
.heine .swiper-container .heineWord .heineWordTit figure sup{ padding: 0 10px;}
.heine .swiper-container .heineWord .heineWordExe{ display: flex; flex-direction: column; line-height: 2.2; font-size: 16px; border-top: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5; padding: 25px 0; margin: 35px 0;}
.heine .swiper-container .heineWord .heineWordExe p{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.heine .swiper-container .heineWord .heineWordZi{ display: flex; flex-direction: column; font-size: 20px; padding-bottom: 10px;}
.heine .swiper-container .heineWord .heineWordDiv{ display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between;}
.heine .swiper-container .heineWord .heineWordDiv .heineWordDivLi{ display: flex; flex-direction: column; background: #F8F8F8; border: 1px solid #E5E5E5; border-radius: 4px; padding: 0 10px; width: 44%; margin-top: 10px;}
.heine .swiper-container .heineWord .heineWordDiv .heineWordDivLi .text{ width: 100%; height: 44px; line-height: 100%; background: none;}
.heine .swiper-container .heineWord .heineWordDiv .heineWordDivAn{ display: flex; flex-direction: column; padding: 0 10px; width: 44%; background: #ff5722; margin-top: 10px; border-radius: 4px; cursor: pointer; transition: all 0.3s linear;}
.heine .swiper-container .heineWord .heineWordDiv .heineWordDivAn .sub{ width: 100%; height: 46px; line-height: 100%; background: none; color: #FFF; font-size: 15px; cursor: pointer;}
.heine .swiper-container .heineWord .heineWordDiv .heineWordDivAn:hover{ background: #C69C4E;}
.heine .swiper-container .heineWord .heineWordTui{ display: flex; flex-direction: column; position: absolute; right: 40px; top: 0; z-index: 10; width: 51px; height: 47px; align-items: center; justify-content: center; background: url(../images/heinewordtui11.png) no-repeat; transition: all 0.3s linear; cursor: pointer; color: #FFF; font-size: 12px;}
.heine .swiper-container .heineWord .heineWordTui:hover{ background: url(../images/heinewordtui22.png) no-repeat;}
.heine .swiper-button-next, .heine .swiper-button-prev{ display: flex; flex-direction: column; justify-content: center; align-items: center;}
.heine .swiper-button-next:after, .heine .swiper-button-prev:after{ font-size: 50px; color: #DDD; font-weight: bold;}
.heine .swiper-button-next{ right: -80px;}
.heine .swiper-button-prev{ left: -80px;}
.heine .swiper-button-next:hover:after, .heine .swiper-button-prev:hover:after{ color: #ff5722;}


.vision{ background: url(../images/vision.jpg) no-repeat; background-size: cover;}
.quency{ display: flex; justify-content: space-between; background: #FFF;}
.quency .quencyBox{ display: flex; flex-direction: column; justify-content: space-between; width: 440px;}
.quency .quencyBox li{ display: flex; flex-direction: row; justify-content: space-between; padding: 15px 20px; border-bottom: 1px dotted #E5E5E5; cursor: pointer;}
.quency .quencyBox li .quencyBoxPic{ display: flex; flex-direction: column; position: relative; align-items: center; justify-content: center; width: 140px; height: 70px; overflow: hidden; background: #000;}
.quency .quencyBox li .quencyBoxPic .img{ width: 100%; object-fit: cover;}
.quency .quencyBox li .quencyBoxPic .quencyBoxPicImg{ width: 26px; height: 26px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); box-sizing: border-box;}
.quency .quencyBox li .quencyBoxPic span{ color: #FFF; opacity: 0; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 20; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.quency .quencyBox li .quencyBoxCont{ display: flex; flex-direction: column; justify-content: center; width: 240px; line-height: 2.2;}
.quency .quencyBox li .quencyBoxCont h2{ font-size: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.quency .quencyBox li .quencyBoxCont p{ font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.quency .quencyBox li.on{ background: #F8F8F8;}
.quency .quencyBox li.on .quencyBoxPic .img{ opacity: 0.5;}
.quency .quencyBox li.on .quencyBoxPic .quencyBoxPicImg{ display: none;}
.quency .quencyBox li.on .quencyBoxPic span{ opacity: 1;}
.quency .quencyBox li.on .quencyBoxCont h2{ color: #ff5722;}

.quency .quencyDiv{ overflow:hidden; width: 800px;}
.quency .quencyDiv .quencyDivUp{flex-direction: column;position: relative;height: 520px;cursor: pointer;}
.quency .quencyDiv .quencyDivUp.on{ display: flex;}
.quency .quencyDiv .quencyDivUp .quencyDivUpPic{ width: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 10;}
.quency .quencyDiv .quencyDivUp .quencyDivUpImg{display: flex;flex-direction: column;position: absolute;left: 0;top: 0;right: 0;bottom: 0;justify-content: center;align-items: center;z-index: 20;background-color: #0000001c;}
.quency .quencyDiv .quencyDivUp .quencyDivUpVideo{ width: 100%; height: 520px; object-fit: cover;}

.viewMore.xinjia{ flex-direction: row;}
.viewMore.xinjia .viewMoreOn{ background: #C69C4E; line-height: 44px; padding: 0 50px; border-radius: 22px; color: #FFF; font-size: 16px; transition: all 0.3s linear;}
.viewMore.xinjia .viewMoreOn:hover{ background: #ff5722;}

/* 预约线下参观 */
.lookat{position:fixed;top:0 !important;left:0;display:none;z-index:1000; width:100%; height:100%; background: rgba(0,0,0,0.3);}
.lookat .lookatBox{ position: absolute; width: 520px; left: 50%; top: 50%; transform: translate(-50%,-50%); box-sizing: border-box; background: #FFF; box-shadow: 0 0 20px 0 rgba(0,0,0,0.2);}
.lookat .lookatBox .close{ display: flex; flex-direction: column; justify-content: center; align-items: center; position:absolute; right: 15px; top: 15px; font-size: 20px; color: #FFF; background: rgba(0,0,0,0.5); width: 30px; height: 30px; border-radius: 50%; }
.lookat .lookatBox .close:hover{ background: rgba(230,0,18,0.5);}
.lookat .lookatBox .lookatBoxDiv{display: flex; flex-direction: column; padding: 20px 55px;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTit{ display: flex; flex-direction: column; align-items: center; line-height: 2;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTit h2{ font-size: 30px;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTian{ display: flex; flex-direction: column; padding: 10px 0;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTian .lookatBoxDivTianLi{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex; display: flex; align-items: center; margin-top: 15px;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTian .lookatBoxDivTianLi .lookatBoxDivTianLiCont{ width: 90px; font-size: 16px;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTian .lookatBoxDivTianLi .lookatBoxDivTianLiTent{-webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; display: flex; flex-direction: column; border: 1px solid #E5E5E5; padding: 0 10px;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTian .lookatBoxDivTianLi .lookatBoxDivTianLiTent .text{ width: 100%; height: 50px; color: #888;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTian .lookatBoxDivTianOn{ display: flex; flex-direction: column; margin-top: 30px;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTian .lookatBoxDivTianOn .sub{ height: 50px; background: #ff5722; font-size: 18px; color: #FFF; cursor: pointer; transition: all 0.3s linear;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivTian .lookatBoxDivTianOn .sub:hover{ background: #C69C4E;}
.lookat .lookatBox .lookatBoxDiv .lookatBoxDivExe{ display: flex; flex-direction: column; text-align: center; color: #AAA; padding-top: 10px;}


.grade{ padding: 40px 0; background: #F8F8F8;}
.grade .inner{ display: flex; flex-direction: row; justify-content: space-between;}
.grade .inner .gradeDiv{ display: flex; flex-direction: column; width: 740px;}
.grade .inner .gradeDiv.gradeKuan{ width: 440px;}
.grade .inner .gradeDiv .gradeDivMing{ display: flex; flex-direction: column; padding-bottom: 30px;}
.grade .inner .gradeDiv .gradeDivMing h2{ font-size: 34px;}
.grade .inner .gradeDiv .gradeDivMing figure{ display: flex; flex-direction: row; justify-content: space-between;}
.grade .inner .gradeDiv .gradeDivMing figure span{ font-size: 16px; color: #666;}
.grade .inner .gradeDiv .gradeDivMing figure a{ font-size: 16px; color: #666; text-transform: uppercase;}


.wage{ display: flex; flex-direction: column; position: relative;}
.wage .swiper-container{ width: 100%; height: 100%;}
.wage .swiper-container .swiper-slide{ display: flex; flex-direction: column;}
.wage .swiper-container .swiper-slide a{ display: flex; flex-direction: column; position: relative;}
.wage .swiper-container .swiper-slide a img{ width: 100%; height: 350px; object-fit: cover;}
.wage .swiper-button-next, .wage .swiper-button-prev{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 30px; height: 60px; background: rgba(0,0,0,0.5);}
.wage .swiper-button-next:after, .wage .swiper-button-prev:after{ font-size: 20px; color: #FFF;}
.wage .swiper-button-next{ right: 0;}
.wage .swiper-button-prev{ left: 0;}
.wage .swiper-button-next:hover, .wage .swiper-button-prev:hover{ background: rgba(230,0,18,0.5);}
.wage .swiper-container .swiper-slide a figure{ position: absolute; left: 0; right: 0; bottom: 0; z-index: 10; background: rgba(0,0,0,0.5); padding: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #FFF; text-align: center;}




.gradeDivDown{ display: flex; flex-direction: column;}
.gradeDivDown .swiper-container{ width: 100%; height: 100%;}
.gradeDivDown .swiper-container .swiper-slide{ display: flex; flex-direction: column;}
.gradeDivDown .swiper-container .swiper-slide a{ display: flex; flex-direction: column; position: relative;}
.gradeDivDown .swiper-container .swiper-slide a img{ width: 100%; height: 350px; object-fit: cover;}
/* .gradeDivDown .swiper-container .swiper-pagination{ display: none;}
.gradeDivDown .swiper-container .swiper-pagination-bullet{ background: #FFF; border-radius: 4px; opacity: 1; margin: 0 6px;}
.gradeDivDown .swiper-container .swiper-pagination-bullet-active{ width: 25px;} */
.gradeDivDown .swiper-button-next, .gradeDivDown .swiper-button-prev{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 30px; height: 60px; background: rgba(0,0,0,0.5);}
.gradeDivDown .swiper-button-next:after, .gradeDivDown .swiper-button-prev:after{ font-size: 20px; color: #FFF;}
.gradeDivDown .swiper-button-next{ right: 0;}
.gradeDivDown .swiper-button-prev{ left: 0;}
.gradeDivDown .swiper-button-next:hover, .gradeDivDown .swiper-button-prev:hover{ background: rgba(230,0,18,0.5);}
.gradeDivDown .swiper-container .swiper-slide a figure{ position: absolute; left: 0; right: 0; bottom: 0; z-index: 10; background: rgba(0,0,0,0.5); padding: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #FFF; text-align: center;}




.path{ display: flex; flex-direction: column; position: relative;}
.path:after{ content: ''; position: absolute; left: 0; right: 0; bottom: 15px; height: 1px; background: #E5E5E5;}
.path ol{ display: flex; flex-direction: row; justify-content: space-between; position: relative; z-index: 10;}
.path ol li{ display: flex; flex-direction: column; align-items: center;}
.path ol li .pathPic{ display: flex; flex-direction: column; justify-content: center;}
.path ol li .pathTent{ font-size: 18px; padding: 20px 0 30px;}
.path ol li .pathNum{ height: 30px; padding: 0 6px; background: #FFF;}
.path ol li .pathNum span{ width: 26px; height: 30px; background: url(../images/pathnum.png) no-repeat; display: flex; flex-direction: column; justify-content: center; align-items: center; font-family: 'DIN'; font-size: 16px; color: #999;}
.path ol li:hover .pathPic img{ animation: jello 1.2s;}

.mation{ padding-top: 0;}
.mation .zixun{ display: flex; flex-direction: row; justify-content: space-between;}
.mation .zixun .zixunDiv{ display: flex; flex-direction: column; width: 620px;}
.mation .zixun .zixunDiv.zixunKuan{ width: 580px;}
.mation .zixun .zixunDiv .zixunDivMing{ display: flex; flex-direction: row; justify-content: space-between; padding-bottom: 30px;}
.mation .zixun .zixunDiv .zixunDivMing h2{ font-size: 22px; font-weight: bold;}
.mation .zixun .zixunDiv .zixunDivMing figure{ display: flex; flex-direction: column;}
.mation .zixun .zixunDiv .zixunDivMing figure a{ color: #666; font-size: 16px;}
.mation .zixun .zixunDiv .zixunDivMing figure a:hover{ color: #ff5722;}
.mation .zixun .zixunDiv .zixunDivMing strong{ display: flex; flex-direction: row;}
.mation .zixun .zixunDiv .zixunDivMing strong a{ font-size: 15px; color: #FFF; background: #C69C4E; border-radius: 17px; height: 34px; line-height: 34px; padding: 0 20px; margin-left: 10px;}
.mation .zixun .zixunDiv .zixunDivMing strong a:hover{ background: #ff5722;}


.zixunDivBox{ display: flex; flex-direction: column;}
.zixunDivBox .swiper-container{ width: 100%; height: 100%;}
.zixunDivBox .swiper-container .swiper-slide{ display: flex; flex-direction: column;}
.zixunDivBox .swiper-container .swiper-slide .zixunDivBoxPic,.zixunDivBox .swiper-container .swiper-slide .zixunDivBoxPic a{ display: flex; flex-direction: column; overflow: hidden;}
.zixunDivBox .swiper-container .swiper-slide .zixunDivBoxPic a img{ width: 100%; height: 430px; object-fit: cover; transition: all 0.3s linear; transform: scale(1.1);}
.zixunDivBox .swiper-container .swiper-slide .zixunDivBoxTent{ display: flex; flex-direction: column; margin-top: 30px; line-height: 30px;}
.zixunDivBox .swiper-container .swiper-slide .zixunDivBoxTent figure{ padding-bottom: 15px; width: 100%; overflow:hidden;display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex; display: flex;}
.zixunDivBox .swiper-container .swiper-slide .zixunDivBoxTent figure h2{ font-size: 24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 10px;-webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1;}
.zixunDivBox .swiper-container .swiper-slide .zixunDivBoxTent figure span{ color: #666;}
.zixunDivBox .swiper-container .swiper-slide .zixunDivBoxTent p{ color: #666; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;}
.zixunDivBox .swiper-pagination{ top: 400px;}
.zixunDivBox .swiper-container .swiper-pagination-bullet{ background: none; border: 1px solid #FFF; opacity: 1; margin: 0 6px;}
.zixunDivBox .swiper-container .swiper-pagination-bullet-active{ background: #FFF;}
.zixunDivBox .swiper-container .swiper-slide:hover .zixunDivBoxPic a img,.zixunDivNide ol li:hover a .zixunDivNidePic img{ transform: scale(1);}


.zixunDivNide{ display: flex; flex-direction: column;}
.zixunDivNide ol{ display: flex; flex-direction: column;}
.zixunDivNide ol li{ padding: 22px 0; border-bottom: 1px dotted #E5E5E5;}
.zixunDivNide ol li:nth-child(1){ padding-top: 0;}
.zixunDivNide ol li a{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex; display: flex;}
.zixunDivNide ol li a .zixunDivNidePic{ display: flex; flex-direction: column; overflow: hidden;}
.zixunDivNide ol li a .zixunDivNidePic img{ width: 140px; height: 100px; object-fit: cover; transition: all 0.3s linear; transform: scale(1.1);}
.zixunDivNide ol li a .zixunDivNideCont{ padding-left: 24px; -webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; overflow:hidden; line-height: 30px; display: flex; flex-direction: column; justify-content: center;}
.zixunDivNide ol li a .zixunDivNideCont h2{ font-size: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 10px;}
.zixunDivNide ol li a .zixunDivNideCont p{ color: #666; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;}


/* 竣工大吉页面样式 */
.kernel{ display: flex; flex-direction: column;}
.kernel .inner{ display: flex; flex-direction: column;}
.seaton{ display: flex; flex-direction: row; color: #888; align-items: center; line-height: 20px; padding: 30px 0;}
.seaton img{ width: 18px; margin-right: 10px;}
.seaton a,.detail .seaton b{ color: #888;}
.seaton b{ padding: 0 10px;}
.seaton span{ color: #333;}

.lanmu{ display: flex; flex-direction: row; justify-content: space-around; background: #F8F8F8; align-items: center; padding: 15px 0;}
.lanmu a{ font-size: 18px; line-height: 40px;}
.lanmu a.on{ color: #FFF; background: #ff5722; border-radius: 20px; padding: 0 40px;}

.liebiao{ display: flex; flex-direction: column; padding: 30px 0;}
.liebiao ol{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.liebiao ol li{ width: 32%; display: flex; flex-direction: column;}
.liebiao ol li a{ display: flex; flex-direction: column;}
.liebiao ol li a .liebiaoPic{ display: flex; flex-direction: column; overflow: hidden; position: relative;}
.liebiao ol li a .liebiaoPic:before{ content: ""; position: absolute; width: 200px; height: 100%; top: 0; left: -150px; z-index: 10;
	overflow: hidden;
	background: -moz-linear-gradient(left, rgba(255, 255, 255, 0)0, rgba(255, 255, 255, .2)50%, rgba(255, 255, 255, 0)100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(50%, rgba(255, 255, 255, .2)), color-stop(100%, rgba(255, 255, 255, 0)));
	background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0)0, rgba(255, 255, 255, .2)50%, rgba(255, 255, 255, 0)100%);
	background: -o-linear-gradient(left, rgba(255, 255, 255, 0)0, rgba(255, 255, 255, .2)50%, rgba(255, 255, 255, 0)100%);
	-webkit-transform: skewX(-25deg);
	-moz-transform: skewX(-25deg);}   
.liebiao ol li a .liebiaoPic img{ width: 100%; transition: all 0.3s linear;}
.liebiao ol li a h2{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; text-align: center; margin: 20px 0;}
.liebiao ol li:hover a .liebiaoPic img{ transform: scale(1.1);}
.liebiao ol li:hover a .liebiaoPic:before{ left: 150%; transition: left 1s ease 0s;}

.paging{ display: flex; flex-direction: row; justify-content: center; padding: 40px 0 60px; line-height: 40px;}
.paging a{ display: inline-block; padding: 0 16px; height: 40px; background: #FFF; border: 1px solid #E5E5E5; margin: 0 6px; box-sizing: border-box; border-radius: 3px;}
.paging a.on{ background: #ff5722; color: #FFF; border-color: #FFF;}
.paging .text{width: 40px; text-align: center; height: 40px; background: #FFF; border: 1px solid #E5E5E5; margin: 0 6px; box-sizing: border-box; border-radius: 3px;}
.paging a.pagingGo{ background: #F8F8F8;}


/* 视频看装修 */
.stock{ display: flex; flex-direction: column; padding: 10px 0;}
.stock ol{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.stock ol li{ width: 32%; display: flex; flex-direction: column; margin-top: 20px; background: #F8F8F8;}
.stock ol li .stockWord{ display: flex; flex-direction: column; position: relative;overflow: hidden;}
.stock ol li .stockWord .quencyDivUpPic{ width: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 10; height: 260px; object-fit: cover;}
.stock ol li .stockWord .quencyDivUpImg{ display: flex; flex-direction: column; position: absolute; left: 0; top: 0; right: 0; bottom: 0; justify-content: center; align-items: center; z-index: 20;}
.stock ol li .stockWord .quencyDivUpImg img{ width: 60px;}
.stock ol li .stockWord .quencyDivUpVideo{ width: 100%; height: 260px; object-fit: cover;}
.stock ol li .stockTwnt{ display: flex; flex-direction: column; text-align: center; padding: 15px;}
.stock ol li .stockTwnt h2{ font-size: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.stock ol li .stockTwnt p{ color: #666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}